import React from 'react'
import { Image } from 'antd-mobile'
import { Link } from 'react-router-dom'
import "./NewsItem.less"
import PropTypes from 'prop-types'


export default function NewsItem(props) {
    if (!props.news) return null;
    if (!Array.isArray(props.news.images)) props.news.images = "";

    return (
        <div className="news-item-box">
            <Link to={`/detail/${props.news.id}`}>
                <div className="content">
                    <h4 className="title">{props.news.title}</h4>
                    <p className="author">{props.news.hint}</p>
                </div>
                <Image lazy src={props.news.images || props.news.image} />
            </Link>
        </div>
    )
}

NewsItem.propTypes = {
    news: PropTypes.object
}

NewsItem.defaultProps = {
    news: null
}
